<template>
  <div>
    <el-form label-width="120px" :model="form">

      <el-row type="flex">
        <el-col>
          <el-form-item label="姓名：" style="width:330px">
            <el-input v-model="form.name" placeholder="请输入你的姓名" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="性别：">
            <el-radio-group v-model="form.gender">
              <el-radio :label="1">
                男
              </el-radio>
              <el-radio :label="2">
                女
              </el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex">
        <el-col>
          <el-form-item label="联系电话：" style="width:330px">
            <el-input v-model="form.num" type="number" placeholder="请输入你的电话号码" />
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="预约时间：">
            <el-radio-group v-model="form.time">
              <el-radio :label="1">
                当天预约
              </el-radio>
              <el-radio :label="2">
                隔天预约
              </el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item label="症状：" style="width:330px">
        <el-input v-model="form.symptom" :rows="4" type="textarea" placeholder="请输入你的症状" maxlength="50" show-word-limit style="line-height: 7px;" />
      </el-form-item>

      <el-row type="flex">
        <el-col>
          <el-form-item label="选择科室：">
            <el-select v-model="form.department" placeholder="请选择你的科室">
              <el-option
                v-for="item in 3"
                :key="item"
                :label="item"
                :value="item"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col>
          <el-form-item label="选择医生：">
            <el-select v-model="form.department" placeholder="请选择你的医生">
              <el-option
                v-for="item in 3"
                :key="item"
                :label="item"
                :value="item"
              />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex" justify="center">
        <el-button type="primary">
          确定挂号
        </el-button>
      </el-row>
    </el-form>
  </div>
</template>

<script>
export default {
  name: 'Reserve',
  data() {
    return {
      form: {
        name: '',
        gender: '',
        num: '',
        time: '',
        symptom: '',
        department: ''
      }
    }
  }
}
</script>

<style lang='scss' scoped>

</style>
